<template>
	<view>
		<view class="main">
			<view class="card">
				<view class="card-tit flex align"><text></text>基本信息</view>
				<view class="input-item flex align">
					<view>作品链接</view>
					<input placeholder="" v-model="info.link" disabled="" />
				</view>
				<view class="input-item flex align">
					<view>审核状态</view>
					<view style="" v-if="info.check_status==1">{{check_status}}</view>
					<view style="color: #FF6543;" v-if="info.check_status==2">{{check_status}}</view>
					<view style="color: red;" v-if="info.check_status==3">{{check_status}}</view>
					<!-- <input placeholder="" v-model="check_status" disabled="" /> -->
				</view>
				<view class="input-item flex align" v-if="info.check_time!=null">
					<view>审核时间</view>
					<input placeholder="" v-model="info.check_time" disabled="" />
				</view>
				<view class="input-item flex align" v-if="info.check_msg!=null&&info.check_msg!=''">
					<view>审核信息</view>
					<input placeholder="" v-model="info.check_msg" disabled="" />
				</view>
			</view>
			<view class="card">
				<view class="card-tit flex align"><text></text>视频二维码</view>
				<view class="logo flex align warp">
					<view @click="toPre(index,info.task_images)" v-for="(item,index) in info.task_images" :key="index"
						style="position: relative;">
						<image :src="item"></image>
					</view>
				</view>
			</view>
			<view class="card">
				<view class="card-tit flex align"><text></text>POI收藏截图</view>
				<view class="logo flex align warp">
					<view @click="toPre(index,info.poi_images)" v-for="(item,index) in info.poi_images" :key="index"
						style="position: relative;">
						<image :src="item"></image>
					</view>
				</view>
			</view>
			<view class="card" v-if="info.praise_images!=null">
				<view class="card-tit flex align"><text></text>好评截图</view>
				<view class="logo flex align warp">
					<view @click="toPre(index,info.praise_images)" v-for="(item,index) in info.praise_images" :key="index"
						style="position: relative;">
						<image :src="item"></image>
					</view>
				</view>
			</view>
			<view class="card" v-if="info.check_status==1">
				<view class="card-tit flex align"><text></text>审核</view>
				<view class="msg-tit">审核信息：</view>
				<textarea v-model="check_msg" placeholder="请输入审核理由"></textarea>
				<view class="flex align btn-item">
					<view @click="toCheck(3)">审核不通过</view>
					<view @click="toCheck(2)">审核通过</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		taskSubmitDetailCompany,
		taskSubmitCheck
	} from '@/api/apiData.js';
	export default {
		data() {
			return {
				info: '',
				check_status: '',
				check_msg: ''
			};
		},
		onLoad(option) {
			this.id = option.id
			this.getInfo()
		},
		methods: {
			toPre(i, item) {
				uni.previewImage({
					urls: item,
					current: i
				})
			},
			async getInfo() {
				const result = await taskSubmitDetailCompany({
					id: this.id
				})
				if (result.code == 1) {
					this.info = result.data
					this.check_status = result.data.check_status == 1 ? '待审核' : result.data.check_status == 2 ?
						'审核通过' : '审核未通过'
				} else {
					uni.showToast({
						title: result.msg,
						icon: 'error'
					})
				}
			},
			toCheck(n) {
				let that = this
				let msg = n==2?'审核通过':'审核不通过'
				uni.showModal({
					title: "提示",
					content: "确定要"+msg+"吗？",
					showCancel: true,
					success: res => {
						if (res.confirm) {
							that.toCom(n)
						} else {

						}
					}

				})
			},
			async toCom(n){
				const result = await taskSubmitCheck({id:[this.id],check_status:n,check_msg:this.check_msg})
				if(result.code==1){
					uni.showToast({
						title:result.msg
					})
					setTimeout(()=>{
						uni.navigateBack()
					},500)
				}else{
					uni.showToast({
						title:result.msg,
						icon:'error'
					})
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	.main {
		margin: 24rpx;
		padding-bottom: 100rpx;

		.card {
			border-radius: 12rpx;
			box-shadow: 1rpx 1rpx 5rpx 1rpx gainsboro;
			padding: 30rpx 24rpx;
			background: white;
			margin-bottom: 30rpx;

			.loadUp {
				background: #D9D9D9;
				border-radius: 12rpx;
				width: fit-content;
				padding: 43rpx;
				margin-top: 20rpx;
			}

			.logo {
				flex-wrap: wrap;
				margin-top: 20rpx;

				image {
					width: 150rpx;
					height: 150rpx;
					margin-right: 20rpx;
					margin-top: 10rpx;
				}

				._del {
					position: absolute;
					top: -10rpx;
					right: -5rpx;
				}
			}

			.card-tit {
				font-size: 32rpx;
				font-weight: bold;

				text {
					background: #FF6543;
					display: block;
					width: 5rpx;
					height: 32rpx;
					margin-right: 10rpx;
				}
			}

			.input-item {
				padding: 19rpx 0;
				border-bottom: solid 1rpx #D9D9D9;
				font-size: 28rpx;

				view {
					width: 30%;
				}
			}

			.msg-tit {
				font-size: 28rpx;
				margin: 20rpx 0;
			}

			textarea {
				border: solid 1rpx gainsboro;
				padding: 20rpx;
				font-size: 30rpx;
			}

			.btn-item {
				margin: 20rpx 5rpx;
				justify-content: space-around;

				view {
					background: #FF6543;
					color: white;
					font-size: 28rpx;
					width: fit-content;
					padding: 10rpx 40rpx;
					border-radius: 10rpx;
				}

				view:nth-child(1) {
					background: red;
				}
			}
		}

		.resign-btn {
			background: #FF6543;
			border-radius: 12rpx;
			font-size: 48rpx;
			font-weight: bold;
			color: white;
			padding: 10rpx 81rpx;
			width: fit-content;
			margin: 80rpx auto;
		}
	}
</style>